
<template>
    <div>
        <el-breadcrumb
            separator-class="el-icon-arrow-right"
            class="breadcrumb-base"
            style="line-height: 30px"
        >
            <el-breadcrumb-item>
                <!--:to="{ path: '/application' }"-->
                <i class="  el-icon-mouse"></i>
                <span>回写日志</span>
            </el-breadcrumb-item>
        </el-breadcrumb>
        <div class="main-container">
            <div class="filter-box">
                <div class="filter-item">
                    <span>类型:</span>
                    <el-select
                        v-model="formData.type"
                        placeholder="请选择"
                        size="mini"
                        clearable
                    >
                        <el-option
                            v-for="item in typeList"
                            :key="item.id"
                            :label="item.name"
                            :value="item.id"
                        >
                        </el-option>
                    </el-select>
                </div>
                <div class="filter-item">
                    <span style="width:60px">病理ID:</span>
                    <el-input
                        v-model="formData.pathologyId"
                        placeholder="请输入病理ID"
                        size="mini"
                        clearable
                    ></el-input>
                </div>
                <el-button
                    type="primary"
                    size="mini"
                    @click="tableDataList"
                >搜索</el-button>
            </div>
            <div style="width: 100%">
                <el-table
                    height="570"
                    :data="tableData"
                    :border="true"
                    :cell-style="{ 'text-align': 'center' }"
                    :header-cell-style="{
            'background-color': '#E6E9EF',
            color: '#777C7C',
            'font-weight': '400',
            'font-size': '15px',
            'border-right': '1px solid #ffffff',
            'text-align': 'center',
          }"
                    size="mini"
                    style="width: 100%; margin-top: 20px"
                    stripe
                >
                    <el-table-column
                        prop="id"
                        label="id"
                    ></el-table-column>
                    <el-table-column
                        prop="pathologyId"
                        label="病理ID"
                    ></el-table-column>
                    <el-table-column
                        prop="jobName"
                        label="医生工号"
                    ></el-table-column>

                    <el-table-column
                        prop="type"
                        label="日志类型"
                    ></el-table-column>
                    <el-table-column
                        prop="isSuccess"
                        label="是否成功"
                    ></el-table-column>
                    <el-table-column
                        prop="checkCategory"
                        label="检查类型"
                    ></el-table-column>
                    <el-table-column
                        prop="createTime"
                        label="创建时间"
                    ></el-table-column>
                    <el-table-column
                        prop="reason"
                        label="备注"
                    ></el-table-column>

                </el-table>
                <el-row
                    style="margin-top: 10px"
                    align="right"
                >
                    <el-pagination
                        @current-change="handleCurrentChange"
                        @size-change="handleSizeChange"
                        :current-page="pageInfo.page"
                        :page-size="pageInfo.size"
                        :page-sizes="pagination_page_sizes"
                        :total="pageInfo.total"
                        style="text-align: center; margin-top: 12px"
                        layout="sizes, prev, pager, next, total"
                    >
                    </el-pagination>
                </el-row>
            </div>
        </div>
    </div>
</template>

<script>
import { itemsPerPage } from '@/client/libs/util';
import { PAGINATION_PAGE_SIZES } from '@/client/consts/constant';

export default {
    name: 'cancerHospitalLog',
    data() {
        return {
            pagination_page_sizes: PAGINATION_PAGE_SIZES,
            formData: {
                pathologyId: '', //搜索条件，患者病理号，选填
                type: null, //搜索条件，日志类型(0：回写；1：撤回)，选填
                page: 0, //页数(必传，传0)
                size: 10, //每页条数(必传)
            },
            typeList: [
                { id: 0, name: '回写' },
                { id: 1, name: '撤回' },
            ],
            tableData: [],
            pageInfo: {
                page: 0,
                size: itemsPerPage.get(),
                total: 15,
            },
        };
    },
    mounted() {
        this.tableDataList();
    },
    methods: {
        handleSizeChange(val) {
            itemsPerPage.set(val);
            this.pageInfo.size = val;
            this.tableDataList();
        },
        handleCurrentChange(val) {
            this.pageInfo.page = val;
            this.tableDataList();
        },

        //请求典型案例库tabledata数据列表
        tableDataList() {
            try {
                this.formData.page = this.pageInfo.page;
                this.formData.size = this.pageInfo.size;

                this.$axios({
                    method: 'POST',
                    url: `/PROXY-Remote/cancerHospitalLog/findAll`,
                    data: this.formData,
                }).then((res) => {
                    if (res.data.code === 200) {
                        this.pageInfo = res.data.pageInfo;
                        this.tableData = res.data.data;
                        this.tableData.forEach((item) => {
                            item.type =
                                item.type == 0 ? '回写数据' : '撤回数据';
                            item.isSuccess = item.isSuccess == 0 ? '是' : '否';
                        });
                    }
                });
            } catch (e) {
                throw new Error(e);
            }
        },
    },
};
</script>

<style scoped>
.el-table th.gutter {
    display: table-cell !important;
}

.filter-box {
    display: flex;
    justify-content: space-between;
    font-size: 14px;
}

.filter-item {
    display: flex;
    align-items: center;
}
</style>
